/**
 * 报事统计列表
 * @author zhangqiang
 * @date   2016/10/20
 */
$greeen:#03B0BE;
$pink:#E21739;
@import "../mixins";

.list-census{
    .select-month{
        background: #fff;
        height: .6rem;
        padding-top: .1rem;
        position: relative;
        &:before{
            position: absolute;
            right: 0;
            bottom: 0;
            left: 0;
            height: 1px;
            content: '';
            webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
            background-color: #c8c7cc;
        }
        .flex-item{
            color: $greeen;
            font-size: .2rem;
            .title-name{
                padding: 0 .1rem;
                padding: 0 .1rem;
            }
        }
    }
    .header{
        position: relative;
        &:before{
            position: absolute;
            right: 0;
            bottom: 0;
            left: 0;
            height: 1px;
            content: '';
            webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
            background-color: #c8c7cc;
        }
    }
    .header .item-row {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        text-align: center;
        height: .5rem;
        background-color: white;
    }

    .header .item {
        -webkit-flex: 1;
        -webkit-box-flex: 1;

        > p {
            margin-top: .18rem;
            margin-bottom:0!important;
        }
    }
    .rectangle {
        display: none;
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        width: .7rem;
        height: .04rem;
        background: $greeen;
    }

    .header {
        p {
            color: #3b3b3b;
        }
        font-size: .16rem;
        a {
            position: relative;
            display: block;

            span {
                color: #3b3b3b;
            }
        }

        a.active {

            span {
                color: #03B0BE;
            }

            .rectangle {
                display: block;
            }
        }

        span {
            line-height: .44rem;
        }
    }
    .title{

        position: relative;
        margin-bottom: .1rem;
        background: #fff;

        .back{
            position: absolute;
            left: .1rem;
            bottom: .1rem;
            font-family: "yue-detail" !important;
            font-size: .2rem;
            font-style: normal;
            color: #ccc;
            @include iconAfter('\e6c5');
        }
        p{
            text-align: center;
            height: .35rem;
            font-size: .19rem;
            line-height: .4rem;
        }
        border: 1px solid rgba(100, 100, 100, .3);
    }

    .list{
        display: block;
        padding: .15rem .1rem;
        box-sizing: border-box;
        &:before{
            position: absolute;
            right: 0;
            bottom: 0;
            left: 0;
            height: 1px;
            content: '';
            webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
            background-color: #c8c7cc;
        }
        .loan{
            padding:.11rem .15rem;
            line-height: .02rem;
            .introduce{
                float: left;
                color: #3b3b3b;
            }
            .money{
                float: right;
                color: #3b3b3b;
            }
            .green{
                color: $greeen!important;
            }
            .pink{
                color: $pink;
            }

        }
        &:after{
            display: table;
            content: '';
            clear: both;
        }
        .prod-img{
            float: left;
            padding:0 .1rem;
            img{
                width: 1rem;
                height: 1rem;
                vertical-align: bottom;
            }
        }
        .prod-detail{
            box-sizing: border-box;
            padding: 0 .1rem 0 0;
            float: right;
            width: 64%;
            .title-box{
                margin-bottom: .15rem;
                line-height: .18rem;
                text-align: justify;
                color: #3b3b3b;
            }
            .sales-box{
                &:after{
                    display: table;
                    content: '';
                    clear: both;
                }
                .sales{
                    float: left;
                    color: #aaa;
                }
                .total{
                    float: right;
                    color: #3b3b3b;
                    span{
                        &:nth-child(2){
                            color: $pink;
                        }
                        &:nth-child(3){
                            color: $pink;
                        }
                    }
                }
            }
        }
    }
    &:after{
        display: table;
        content: '';
        clear: both;
    }
    .statistics{
        position: relative;
        &:before{
            position: absolute;
            right: 0;
            bottom: 0;
            left: 0;
            height: 1px;
            content: '';
            webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
            background-color: #c8c7cc;
        }
        p{
            color: $pink;
            float: right;
        }
    }
}








